
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>Loading and Configuring MathJax &mdash; MathJax v2.0 documentation</title>
    <link rel="stylesheet" href="_static/mj.css" type="text/css" />
    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '',
        VERSION:     '2.0',
        COLLAPSE_INDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  true
      };
    </script>
    <script type="text/javascript" src="_static/jquery.js"></script>
    <script type="text/javascript" src="_static/underscore.js"></script>
    <script type="text/javascript" src="_static/doctools.js"></script>
    <!--<script type="text/javascript" src="../../MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>-->
    <link rel="top" title="MathJax v2.0 documentation" href="index.html" />
    <link rel="next" title="Common Configurations" href="config-files.html" />
    <link rel="prev" title="Installing and Testing MathJax" href="installation.html" /> 
  </head>
  <body>
    
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             accesskey="I">index</a></li>
        <li class="right" >
          <a href="config-files.html" title="Common Configurations"
             accesskey="N">next</a> |</li>
        <li class="right" >
          <a href="installation.html" title="Installing and Testing MathJax"
             accesskey="P">previous</a> |</li>
        <li><a href="index.html">MathJax v2.0 documentation</a> &raquo;</li> 
      </ul>
    </div>  

    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
  <div class="section" id="loading-and-configuring-mathjax">
<span id="loading"></span><h1>Loading and Configuring MathJax<a class="headerlink" href="#loading-and-configuring-mathjax" title="Permalink to this headline">¶</a></h1>
<p>You load MathJax into a web page by including its main JavaScript file
into the page.  That is done via a <tt class="docutils literal"><span class="pre">&lt;script&gt;</span></tt> tag that links to the
<tt class="docutils literal"><span class="pre">MathJax.js</span></tt> file.  To do that, place the following line in the <tt class="docutils literal"><span class="pre">&lt;head&gt;</span></tt>
section of your document:</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;path-to-MathJax/MathJax.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
</pre></div>
</div>
<p>where <tt class="docutils literal"><span class="pre">path-to-MathJax</span></tt> is replaced by the URL of the copy of MathJax
that you are loading.  For example, if you are using the MathJax
distributed network service, the tag might be</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/latest/MathJax.js&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>If you have installed MathJax yourself, <tt class="docutils literal"><span class="pre">path-to-MathJax</span></tt> will be the
location of MathJax on your server, or (if you are using MathJax locally
rather than through a server) the location of that directory on your hard
disk.  For example, if the MathJax directory is at the top level of your
web server&#8217;s directory hierarchy, you might use</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;/MathJax/MathJax.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
</pre></div>
</div>
<p>to load MathJax.</p>
<p>If you install MathJax on a server in a domain that is different from the
one containing the page that will load MathJax, then there are issues
involved in doing so that you need to take into consideration.  See the
<a class="reference internal" href="installation.html#cross-domain-linking"><em>Notes About Shared Servers</em></a> for more details.</p>
<p>When you load MathJax, it is common to request a specific
configuration file as discussed in the section on <a class="reference internal" href="#config-files"><em>Using a
Configuration File</em></a> below, and in more detail in the
<a class="reference internal" href="config-files.html#common-configurations"><em>Common Configurations</em></a> section.  A
typical invocation of MathJax would be</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>which loads MathJax with a configuration file that includes everything
you need in order to enter mathematics in either TeX, LaTeX, or MathML
notation, and produces output using MathML if the browser supports
that well enough, or HTML-with-CSS otherwise.  If you <strong>don&#8217;t</strong> load
an explicit configuration file, you will need to include an in-line
configuration block in order to tell MathJax how to read and display
the mathematics on your pages.  See the section below on <a class="reference internal" href="#inline-config"><em>Using
In-line Configuration Options</em></a> for details.</p>
<p>It is best to load MathJax in the document&#8217;s <tt class="docutils literal"><span class="pre">&lt;head&gt;</span></tt> block, but it
is also possible to load MathJax into the <tt class="docutils literal"><span class="pre">&lt;body&gt;</span></tt> section, if
needed.  If you do this, load it as early as possible, as
MathJax will begin to load its components as soon as it is included in
the page, and that will help speed up the processing of the
mathematics on your page.  MathJax does expect there to be a
<tt class="docutils literal"><span class="pre">&lt;head&gt;</span></tt> section to the document, however, so be sure there is one
if you are loading MathJax in the <tt class="docutils literal"><span class="pre">&lt;body&gt;</span></tt>.</p>
<p>It is also possible to load MathJax dynamically after the page has
been prepared, for example, via a <a class="reference external" href="http://www.greasespot.net/">GreaseMonkey</a> script, or using a specially prepared
<a class="reference external" href="http://en.wikipedia.org/wiki/Bookmarklet">bookmarklet</a>.  This is an
advanced topic, however; see <a class="reference internal" href="dynamic.html#ajax-mathjax"><em>Loading MathJax Dynamically</em></a> for more details.</p>
<div class="section" id="loading-mathjax-from-the-cdn">
<span id="loading-cdn"></span><h2>Loading MathJax from the CDN<a class="headerlink" href="#loading-mathjax-from-the-cdn" title="Permalink to this headline">¶</a></h2>
<p>MathJax is available as a web service from <tt class="docutils literal"><span class="pre">cdn.mathjax.org</span></tt>, so you
can obtain MathJax from there without needing to install it on your own
server.  The CDN is part of a distributed &#8220;cloud&#8221; network, so it is
handled by servers around the world.  That means that you should get access
to a server geographically near you, for a fast, reliable connection.</p>
<p>The CDN hosts the most current version of MathJax, as well as older
versions, so you can either link to a version that stays up-to-date as
MathJax is improved, or you can stay with one of the release versions so
that your pages always use the same version of MathJax.</p>
<p>The URL that you use to obtain MathJax determines the version that you
get.  The CDN has the following directory structure:</p>
<div class="highlight-sh"><div class="highlight"><pre>mathjax/         <span class="c"># project-name</span>
   1.0-latest/
   1.1-latest/   <span class="c"># the 1.1 release with any ciritical patches</span>
   2.0-beta/     <span class="c"># temporary</span>
   2.0-latest/   <span class="c"># the 2.0 release with any ciritical patches</span>
   ...
   latest/       <span class="c"># the most current version (2.0-latest in this case)</span>
</pre></div>
</div>
<p>Each directory corresponds to an official MathJax release; however,
hotfixes (urgent bug fixes) will be applied in each release branch as
necessary, even if new releases are not prepared.  In other words,
<tt class="docutils literal"><span class="pre">1.1-latest</span></tt> will initially point to v1.1, but over time may be updated
with patches that would correspond to releases that might be numbers 1.1a,
1.1b, etc., even if such releases are not actually packaged for
separate distribution (they likely won&#8217;t be).
We may occasionally introduce directories for betas, as indicated above,
but they will be temporary, and will be removed after the official
release.</p>
<p>To load from a particular release, use the directory for that release.
For example,</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/1.1-latest/MathJax.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
</pre></div>
</div>
<p>will load the stable v1.1 version, even after we release v2.0 or other later
versions, while</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/latest/MathJax.js&quot;</span><span class="nt">&gt;&lt;/script&gt;</span>
</pre></div>
</div>
<p>will always be the most current stable release, so it will go from v1.1 to
v2.0 automatically when that is released.  Note that all the versions
available on the CDN are stable versions; the development version is not
hosted on the CDN.  (If you wish to use the development version of
MathJax, you will need to install your own copy; see <a class="reference internal" href="installation.html#installation"><em>Installing
and Testing MathJax</em></a> for information on how to do that.)</p>
<p>The use of <tt class="docutils literal"><span class="pre">cdn.mathjax.org</span></tt> is governed by its <a class="reference external" href="http://www.mathjax.org/download/mathjax-cdn-terms-of-service/">terms of service</a>, so be
sure to read that before linking to the MathJax CDN server.</p>
<p>If you wish to use the MathJax CDN but use your own configuration file
rather than one of the pre-defined ones, see the information at the
end of the <a class="reference internal" href="#local-config-files"><em>Using a Local Configuration File</em></a> section below.</p>
</div>
<div class="section" id="configuring-mathjax">
<h2>Configuring MathJax<a class="headerlink" href="#configuring-mathjax" title="Permalink to this headline">¶</a></h2>
<p>There are two ways to configure MathJax:  via a configuration file, or by
including configuration commands within the web page itself.  These can be
used independently, or in combination.  For example, you can load a main
pre-defined configuration file, but include in-line commands to
adjust the configuration to your needs.</p>
<p>Note that you must use at least one of these two forms of configuration.
Unlike MathJax v1.0, version 1.1 and higher does not load a default
configuration file.  If you have been using version 1.0&#8217;s
<tt class="docutils literal"><span class="pre">config/MathJax.js</span></tt> for your configuration, you will need to load that
configuration file explicitly via a <tt class="docutils literal"><span class="pre">config</span></tt> parameter, as described
below.</p>
</div>
<div class="section" id="using-a-configuration-file">
<span id="config-files"></span><h2>Using a configuration file<a class="headerlink" href="#using-a-configuration-file" title="Permalink to this headline">¶</a></h2>
<p>The first way to configure MathJax is to use a configuration file.
MathJax comes with a number of pre-defined configuration files, which are
stored in the <tt class="docutils literal"><span class="pre">MathJax/config</span></tt> directory.  Among these are the following</p>
<dl class="describe">
<dt>
<tt class="descname">default.js</tt></dt>
<dd><p>A file that contains nearly all the configuration options with comments
describing them, which you can edit to suit your needs.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">TeX-AMS-MML_HTMLorMML.js</tt></dt>
<dd><p>Allows math to be specified in <a class="reference internal" href="glossary.html#term-tex"><em class="xref std std-term">TeX</em></a>, <a class="reference internal" href="glossary.html#term-latex"><em class="xref std std-term">LaTeX</em></a>, or
<a class="reference internal" href="glossary.html#term-mathml"><em class="xref std std-term">MathML</em></a> notation, with the <cite>AMSmath</cite> and <cite>AMSsymbols</cite>
packages included, producing output using MathML if the browser
supports it sufficiently, and HTML-with-CSS otherwise.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">TeX-AMS_HTML.js</tt></dt>
<dd><p>Allows math to be specified in <a class="reference internal" href="glossary.html#term-tex"><em class="xref std std-term">TeX</em></a> or <a class="reference internal" href="glossary.html#term-latex"><em class="xref std std-term">LaTeX</em></a> notation, with the
<cite>AMSmath</cite> and <cite>AMSsymbols</cite> packages included, and produces output
using the HTML-CSS output processor.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">MML_HTMLorMML.js</tt></dt>
<dd><p>Allows math to be specified using <a class="reference internal" href="glossary.html#term-mathml"><em class="xref std std-term">MathML</em></a> notation, and produces MathML
output if the browser supports it sufficiently, or HTML-CSS output otherwise.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">AM_HTMLorMML.js</tt></dt>
<dd><p>Allows math to be specified using <a class="reference internal" href="glossary.html#term-asciimath"><em class="xref std std-term">AsciiMath</em></a> notation,
producing output in MathML if the browser supports it
sufficiently, or as HTML-with-CSS otherwise.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">TeX-AMS-MML_SVG.js</tt></dt>
<dd><p>Allows math to be specified in <a class="reference internal" href="glossary.html#term-tex"><em class="xref std std-term">TeX</em></a>, <a class="reference internal" href="glossary.html#term-latex"><em class="xref std std-term">LaTeX</em></a>, or
<a class="reference internal" href="glossary.html#term-mathml"><em class="xref std std-term">MathML</em></a> notation, with the <cite>AMSmath</cite> and <cite>AMSsymbols</cite>
packages included, producing output using SVG.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">TeX-MML-AM_HTMLorMML.js</tt></dt>
<dd><p>Allows math to be specified in <a class="reference internal" href="glossary.html#term-tex"><em class="xref std std-term">TeX</em></a>, <a class="reference internal" href="glossary.html#term-latex"><em class="xref std std-term">LaTeX</em></a>,
<a class="reference internal" href="glossary.html#term-mathml"><em class="xref std std-term">MathML</em></a>, or <a class="reference internal" href="glossary.html#term-asciimath"><em class="xref std std-term">AsciiMath</em></a> notation, with the <cite>AMSmath</cite>
and <cite>AMSsymbols</cite> packages included, producing output using MathML
if the browser supports it sufficiently, and HTML-with-CSS
otherwise.</p>
</dd></dl>

<p>The first of these is a file that you can edit to suit your needs.  It
contains nearly all the configuration options that MathJax allows, and has
comments explaining them.  The others are what are called <cite>combined
configuration files</cite>, which not only configure MathJax, but also pre-load the
various files that the configuration requires.  (The contents of these
files are explained in more detail in the <a class="reference external" href="common-configurations">Common Configurations</a> section.)</p>
<p>Usually, MathJax loads its components only when they are needed, but each
component will require a separate file to be loaded, and that can cause
delays before the mathematics is displayed.  The combined configuration
files load the majority of the needed files all as one large file, reducing
the number of network requests that are needed.  That means you will
probably be getting the components that MathJax needs faster than you would
without the combined file, but you may be loading components that are never
actually used; that is the trade off.</p>
<p>Each of the combined configuration files comes in two flavors:  the ones
listed above, which only configure the output processors but don&#8217;t include
the main code, and a &#8220;full&#8221; version, that also includes the complete
output processors.  For example, with <tt class="docutils literal"><span class="pre">TeX-AMS_HTML.js</span></tt> and
<tt class="docutils literal"><span class="pre">TeX-AMS_HTML-full.js</span></tt>, the latter includes the complete HTML-CSS output
processor.  The &#8220;full&#8221; configuration files are substantially larger (on
the order of 70KB more), so you need to decide whether it is worth loading the
full configuration for your pages.</p>
<p>If most of your pages include mathematics, then it is to your advantage to
load the full version, but if you are including MathJax in a theme file for
a blog or wiki that only includes mathematics occasionally, then perhaps it
is better to use the standard configuration instead, in which case the
output processors are only loaded when they are actually needed, saving the
loading of 70KB for pages that don&#8217;t.  Of course, if your server is
configured to compress the files it sends, the difference between the two
is considerably reduced.  Furthermore, most browsers will cache the
javascript they receive, so the download cost should only occur on the
first page a user views, so it may be best to use the &#8220;full&#8221; version after
all.  Note, however, that mobile devices sometimes have limits on the size
of files that they cache, so they may be forced to download the
configuration on every page.  You need to keep these issues in mind as you
decide on which configuration to use.</p>
<p>To load a configuration file, use <tt class="docutils literal"><span class="pre">config=filename</span></tt> (where <tt class="docutils literal"><span class="pre">filename</span></tt>
is one of the names above without the <tt class="docutils literal"><span class="pre">.js</span></tt>) as a parameter to the URL of
the <tt class="docutils literal"><span class="pre">MathJax.js</span></tt> file.  For example</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>loads the <tt class="docutils literal"><span class="pre">config/TeX-AMS-MML_HTMLorMML.js</span></tt> configuration file from the
MathJax distributed network service.</p>
<p>You can include more than one configuration file by separating them with
commas.  For example, if you have a locally defined configuration file
called <tt class="docutils literal"><span class="pre">MathJax/config/local/local.js</span></tt> that modifies the settings for the
<tt class="docutils literal"><span class="pre">TeX-AMS_HML</span></tt> configuration, defines some new TeX macros, and so on, you
can use</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;path-to-MathJax/MathJax.js?config=TeX-AMS_HTML,local/local&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>to first load the main configuration, then the local modifications.</p>
</div>
<div class="section" id="using-a-local-configuration-file-with-the-cdn">
<span id="local-config-files"></span><h2>Using a local configuration file with the CDN<a class="headerlink" href="#using-a-local-configuration-file-with-the-cdn" title="Permalink to this headline">¶</a></h2>
<p>You can load MathJax from the MathJax CDN server but still use a
configuration from your own local server.  For example, suppose you
have a configuration file called <tt class="docutils literal"><span class="pre">local.js</span></tt> on your own server, in a
directory called <tt class="docutils literal"><span class="pre">MathJax/config/local</span></tt>.  Then you can load MathJax
from the CDN and still use your configuration file as follows:</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML,http://myserver.com/MathJax/config/local/local.js&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>Because the <tt class="docutils literal"><span class="pre">local.js</span></tt> file is not on the CDN server, you must give
the complete URL to the local configuration file.  Note that you also
have to edit the <a class="reference internal" href="api/ajax.html#loadComplete" title="loadComplete"><tt class="xref py py-meth docutils literal"><span class="pre">loadComplete()</span></tt></a> call that is at the bottom of
the configuration file to change it from
<tt class="docutils literal"><span class="pre">[MathJax]/config/local/local.js</span></tt> to the complete URL as you give it
in the <tt class="docutils literal"><span class="pre">config</span></tt> parameter.  In the example above, it would be</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Ajax</span><span class="p">.</span><span class="nx">loadComplete</span><span class="p">(</span><span class="s2">&quot;http://myserver.com/MathJax/config/local/local.js&quot;</span><span class="p">);</span>
</pre></div>
</div>
<p>That is because the <tt class="docutils literal"><span class="pre">[MathJax]</span></tt> in the original URL refers to the
root directory where <tt class="docutils literal"><span class="pre">MathJax.js</span></tt> was loaded, which is on the CDN,
not your local server, and so you need to tell MathJax the actual
location of your configuration file.</p>
</div>
<div class="section" id="using-in-line-configuration-options">
<span id="inline-config"></span><h2>Using in-line configuration options<a class="headerlink" href="#using-in-line-configuration-options" title="Permalink to this headline">¶</a></h2>
<p>The second way to configure MathJax is through <cite>in-line configuration</cite>,
which puts the configuration options within the web page itself. The use
of in-line configuration with MathJax requires two separate  <tt class="docutils literal"><span class="pre">&lt;script&gt;</span></tt>
tags: one for specifying the configuration settings and one for loading of
MathJax.  Because MathJax starts its configuration process as soon as it is
loaded, the configuration script must come <strong>before</strong> the script tag that
loads <tt class="docutils literal"><span class="pre">MathJax.js</span></tt> itself.  You do this by including a <tt class="docutils literal"><span class="pre">&lt;script&gt;</span></tt> with
<tt class="docutils literal"><span class="pre">type=&quot;text/x-mathjax-config&quot;</span></tt> whose content will be run when
MathJax performs its configuration.  Generally, this script will
include a <tt class="xref py py-meth docutils literal"><span class="pre">MathJax.Hub.Config()</span></tt> call to perform MathJax
configuration, but it can also include other MathJax commands, such as
registering signal actions, or any JavaScript commands that you want.
You can have as many such script tags as you need, and MathJax will
process them in the order in which they appear in the document.</p>
<p>For instance,</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/x-mathjax-config&quot;</span><span class="nt">&gt;</span>
  <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Hub</span><span class="p">.</span><span class="nx">Config</span><span class="p">({</span>
    <span class="nx">extensions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;tex2jax.js&quot;</span><span class="p">],</span>
    <span class="nx">jax</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;input/TeX&quot;</span><span class="p">,</span> <span class="s2">&quot;output/HTML-CSS&quot;</span><span class="p">],</span>
    <span class="nx">tex2jax</span><span class="o">:</span> <span class="p">{</span>
      <span class="nx">inlineMath</span><span class="o">:</span> <span class="p">[</span> <span class="p">[</span><span class="s1">&#39;$&#39;</span><span class="p">,</span><span class="s1">&#39;$&#39;</span><span class="p">],</span> <span class="p">[</span><span class="s2">&quot;\\(&quot;</span><span class="p">,</span><span class="s2">&quot;\\)&quot;</span><span class="p">]</span> <span class="p">],</span>
      <span class="nx">displayMath</span><span class="o">:</span> <span class="p">[</span> <span class="p">[</span><span class="s1">&#39;$$&#39;</span><span class="p">,</span><span class="s1">&#39;$$&#39;</span><span class="p">],</span> <span class="p">[</span><span class="s2">&quot;\\[&quot;</span><span class="p">,</span><span class="s2">&quot;\\]&quot;</span><span class="p">]</span> <span class="p">],</span>
      <span class="nx">processEscapes</span><span class="o">:</span> <span class="kc">true</span>
    <span class="p">},</span>
    <span class="s2">&quot;HTML-CSS&quot;</span><span class="o">:</span> <span class="p">{</span> <span class="nx">availableFonts</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;TeX&quot;</span><span class="p">]</span> <span class="p">}</span>
  <span class="p">});</span>
<span class="nt">&lt;/script&gt;</span>
<span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;path-to-MathJax/MathJax.js&quot;</span><span class="nt">&gt;</span>
</pre></div>
</div>
<p>This example includes the <cite>tex2jax</cite> preprocessor and configures it to use
both the standard <a class="reference internal" href="glossary.html#term-tex"><em class="xref std std-term">TeX</em></a> and <a class="reference internal" href="glossary.html#term-latex"><em class="xref std std-term">LaTeX</em></a> math delimiters.  It uses
the <cite>TeX</cite> input processor and the <cite>HTML-CSS</cite> output processor, and forces the
HTML-CSS processor to use the TeX fonts rather than other locally installed
fonts (e.g., <a class="reference internal" href="glossary.html#term-stix"><em class="xref std std-term">STIX</em></a> fonts).  See the <a class="reference internal" href="options/index.html#configuration"><em>configuration options</em></a> section (or the comments in the <tt class="docutils literal"><span class="pre">config/default.js</span></tt>
file) for more information about the configuration options that you can
include in the <tt class="xref py py-meth docutils literal"><span class="pre">MathJax.Hub.Config()</span></tt> call.  This
configuration does <strong>not</strong> load any pre-defined configuration file.</p>
<p>Note that you can combine in-line configuration with file-based
configuration; simply include <tt class="docutils literal"><span class="pre">text/x-mathjax-config</span></tt> scripts as above,
but also include <tt class="docutils literal"><span class="pre">config=filename</span></tt> when you load the <tt class="docutils literal"><span class="pre">MathJax.js</span></tt>
file.  For example, the <cite>tex2jax</cite> preprocessor does <strong>not</strong> enable the TeX
single-dollar in-line math delimiters by default.  You can load one of the
pre-defined configuration files that includes the TeX preprocessor, and use
an in-line configuration block to enable the single-dollar signs, as
in this example:</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/x-mathjax-config&quot;</span><span class="nt">&gt;</span>
  <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Hub</span><span class="p">.</span><span class="nx">Config</span><span class="p">({</span>
    <span class="nx">tex2jax</span><span class="o">:</span> <span class="p">{</span>
      <span class="nx">inlineMath</span><span class="o">:</span> <span class="p">[</span> <span class="p">[</span><span class="s1">&#39;$&#39;</span><span class="p">,</span><span class="s1">&#39;$&#39;</span><span class="p">],</span> <span class="p">[</span><span class="s2">&quot;\\(&quot;</span><span class="p">,</span><span class="s2">&quot;\\)&quot;</span><span class="p">]</span> <span class="p">],</span>
      <span class="nx">processEscapes</span><span class="o">:</span> <span class="kc">true</span>
    <span class="p">}</span>
  <span class="p">});</span>
<span class="nt">&lt;/script&gt;</span>
<span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src=</span><span class="s">&quot;path-to-MathJax/MathJax.js?config=TeX-AMS_HTML&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
</div>
<div class="section" id="configuring-mathjax-after-it-is-loaded">
<span id="delaystartupuntil"></span><h2>Configuring MathJax after it is loaded<a class="headerlink" href="#configuring-mathjax-after-it-is-loaded" title="Permalink to this headline">¶</a></h2>
<p>Because MathJax begins its configuration process immediately after it is
loaded (so that it can start loading files as quickly as it can), the
configuration blocks for MathJax must come before <tt class="docutils literal"><span class="pre">MathJax.js</span></tt> is loaded,
so they will be available to MathJax when it starts up.  There are
situations, however, when you might want to put off configuring MathJax
until later in the page.</p>
<p>One such situation is when you have a site that loads MathJax as part of a
theme or template, but want to be able to modify the configuration on
specific pages of the site.  To accomplish this, you need to ask MathJax
to delay its startup configuration until some later time.  MathJax uses
the <tt class="docutils literal"><span class="pre">delayStartupUntil</span></tt> parameter to control the timing of the startup
sequence.  By default, it is set to <tt class="docutils literal"><span class="pre">none</span></tt>, meaning there is no delay
and MathJax starts configuration right away.</p>
<p>You can set <tt class="docutils literal"><span class="pre">delayStartupUntil=onload</span></tt> in order to prevent MathJax from
continuing its startup process until the page&#8217;s onLoad handler fires.  This
allows MathJax to find the <tt class="docutils literal"><span class="pre">text/x-mathjax-config</span></tt> blocks that occur
anywhere on the page, not just the ones that appear above the <tt class="docutils literal"><span class="pre">&lt;script&gt;</span></tt>
that loads <tt class="docutils literal"><span class="pre">MathJax.js</span></tt>.  It also means that MathJax will not begin
loading any of the files that it needs until then as well, which may delay
the displaying of your mathematics, since the onLoad handler doesn&#8217;t
execute until all the images and other media are available.  (If you have
used a combined configuration file, however, it already includes all the
main files that MathJax needs, so there is not much loss in delaying the
startup.)</p>
<p>You can set <tt class="docutils literal"><span class="pre">delayStartupUntil=configured</span></tt> in order to delay the
startup configuration until the <tt class="xref py py-meth docutils literal"><span class="pre">MathJax.Hub.Configured()</span></tt>
method is called.  This allows you to delay startup until later on the
page, but then restart the MathJax configuration process as soon as
possible rather than waiting for the entire page to load.  For
example, you could use</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span>
   <span class="na">src=</span><span class="s">&quot;path-to-MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML&amp;delayStartupUntil=configured&quot;</span><span class="nt">&gt;</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>in your theme&#8217;s header file, and</p>
<div class="highlight-html"><div class="highlight"><pre><span class="nt">&lt;script </span><span class="na">type=</span><span class="s">&quot;text/javascript&quot;</span><span class="nt">&gt;</span>
  <span class="nx">MathJax</span><span class="p">.</span><span class="nx">Hub</span><span class="p">.</span><span class="nx">Configured</span><span class="p">()</span>
<span class="nt">&lt;/script&gt;</span>
</pre></div>
</div>
<p>in its footer, so that MathJax will delay setting up until the footer
is reached, but will not have to wait until images and other files are
loaded.  In this way, if you have <tt class="docutils literal"><span class="pre">text/x-mathjax-config</span></tt> script
tags within the main body of the document, MathJax will read and
process those before continuing its startup.  In this way you can use
a default configuration that can be modified on a page-by-page basis.</p>
<p>Note that <tt class="xref py py-meth docutils literal"><span class="pre">MathJax.Hub.Configured()</span></tt> is not called by MathJax;
you must make that call somewhere within the page yourself after the
configuration blocks are set up.  If you do not execute this function,
MathJax will not process any of the math on the page.</p>
</div>
<div class="section" id="details-of-the-mathjax-configuration-process">
<h2>Details of the MathJax configuration process<a class="headerlink" href="#details-of-the-mathjax-configuration-process" title="Permalink to this headline">¶</a></h2>
<p>Since there are a number of different ways to configure MathJax, it is
important to know how they interact.  The configuration actions are the
following:</p>
<ol class="arabic simple">
<li>Process any configuration file explicitly specified as a script parameter.</li>
<li>Process the in-line script body (deprecated), if present.</li>
<li>If delayed startup is requested, wait for the indicated signal.</li>
<li>Process <tt class="docutils literal"><span class="pre">text/x-mathjax-config</span></tt> config blocks.</li>
<li>Process any config files queued in the configuration&#8217;s <cite>config</cite> array
by earlier config code.</li>
</ol>
<p>Note that <tt class="docutils literal"><span class="pre">text/x-mathjax-config</span></tt> script blocks must either precede the
<tt class="docutils literal"><span class="pre">MathJax.js</span></tt> script element, or startup must be delayed.  Otherwise, blocks
that follow the <tt class="docutils literal"><span class="pre">MathJax.js</span></tt> script element may or may not be available
when MathJax runs, and browser-dependent erratic behavior will result.</p>
</div>
</div>


          </div>
        </div>
      </div>
      <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper">
  <h3><a href="index.html">Table Of Contents</a></h3>
  <ul>
<li><a class="reference internal" href="#">Loading and Configuring MathJax</a><ul>
<li><a class="reference internal" href="#loading-mathjax-from-the-cdn">Loading MathJax from the CDN</a></li>
<li><a class="reference internal" href="#configuring-mathjax">Configuring MathJax</a></li>
<li><a class="reference internal" href="#using-a-configuration-file">Using a configuration file</a></li>
<li><a class="reference internal" href="#using-a-local-configuration-file-with-the-cdn">Using a local configuration file with the CDN</a></li>
<li><a class="reference internal" href="#using-in-line-configuration-options">Using in-line configuration options</a></li>
<li><a class="reference internal" href="#configuring-mathjax-after-it-is-loaded">Configuring MathJax after it is loaded</a></li>
<li><a class="reference internal" href="#details-of-the-mathjax-configuration-process">Details of the MathJax configuration process</a></li>
</ul>
</li>
</ul>

  <h4>Previous topic</h4>
  <p class="topless"><a href="installation.html"
                        title="previous chapter">Installing and Testing MathJax</a></p>
  <h4>Next topic</h4>
  <p class="topless"><a href="config-files.html"
                        title="next chapter">Common Configurations</a></p>
<div id="searchbox" style="display: none">
  <h3>Quick search</h3>
    <form class="search" action="search.html" method="get">
      <input type="text" name="q" size="18" />
      <input type="submit" value="Go" />
      <input type="hidden" name="check_keywords" value="yes" />
      <input type="hidden" name="area" value="default" />
    </form>
    <p class="searchtip" style="font-size: 90%">
    Enter search terms or a module, class or function name.
    </p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             >index</a></li>
        <li class="right" >
          <a href="config-files.html" title="Common Configurations"
             >next</a> |</li>
        <li class="right" >
          <a href="installation.html" title="Installing and Testing MathJax"
             >previous</a> |</li>
        <li><a href="index.html">MathJax v2.0 documentation</a> &raquo;</li> 
      </ul>
    </div>
    <div class="footer">
        &copy; Copyright 2012 Design Science.
      Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.0.7.
    </div>
    
  </body>
</html>